<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>出货单历史</title>
    <!-- Bootstrap CSS-->
    <link rel="stylesheet" href="../../static/css/lib/bootstrap3.4.1.min.css" th:href="@{/css/lib/bootstrap3.4.1.min.css}">
    <!-- Bootstrap-table CSS-->
    <link rel="stylesheet" href="../../static/css/lib/bootstrap-table.min.css" th:href="@{/css/lib/bootstrap-table.min.css}">
    <!-- jquery-ui CSS-->
    <link rel="stylesheet" href="../../static/css/lib/jquery-ui.min.css" th:href="@{/css/lib/jquery-ui.min.css}">
    <!-- select2 CSS-->
    <link rel="stylesheet" href="../../static/css/lib/select2.min.css" th:href="@{/css/lib/select2.min.css}">
    <link rel="stylesheet" href="../../static/css/lib/select2-bootstrap.min.css" th:href="@{/css/lib/select2-bootstrap.min.css}">
    <link href="../../static/css/file.css" rel="stylesheet" th:href="@{/css/file.css}">
    <link href="../../static/css/table.css" rel="stylesheet" th:href="@{/css/table.css}">
</head>

<body onload="init();">
<div class="panel-body" style="padding-bottom:0;">
    <div class="panel panel-default">
        <!--查询条件-->
        <div class="panel-heading">查询条件</div>
        <div class="panel-body">
            <div class="form-group" style="margin-top:15px">
                <div class="row row-gap">
                    <label class="control-label col-sm-2 label-font" for="txt_search_order_number">订单号</label>
                    <div class="col-sm-4">
                        <input type="text" class="form-control" id="txt_search_order_number">
                    </div>

                    <label class="control-label col-sm-2 label-font" for="txt_search_bill_of_sale_number">出货单号</label>
                    <div class="col-sm-4">
                        <input type="text" class="form-control" id="txt_search_bill_of_sale_number">
                    </div>
                </div>

                <div class="row row-gap">
                    <label class="control-label col-sm-2 label-font" for="txt_search_product_number">客户料号</label>
                    <div class="col-sm-4">
                        <input type="text" class="form-control" id="txt_search_product_number">
                    </div>

                    <label class="control-label col-sm-2 label-font" for="txt_search_code">客户代码</label>
                    <div class="col-sm-4">
                        <input type="text" class="form-control" id="txt_search_code">
                    </div>
                </div>

                <div class="row row-gap">
                    <label class="control-label col-sm-2 label-font" for="txt_search_item_name">品名</label>
                    <div class="col-sm-4">
                        <input type="text" class="form-control" id="txt_search_item_name">
                    </div>

                    <label class="control-label col-sm-2 label-font" for="txt_search_spec">规格</label>
                    <div class="col-sm-4">
                        <input type="text" class="form-control" id="txt_search_spec">
                    </div>
                </div>

                <div class="row row-gap">
                    <label class="control-label col-sm-2 label-font" for="txt_search_start_time" >开始时间</label>
                    <div class="col-sm-4">
                        <input type="datetime-local" class="form-control" id="txt_search_start_time">
                    </div>

                    <label class="control-label col-sm-2 label-font" for="txt_search_end_time">结束时间</label>
                    <div class="col-sm-4">
                        <input type="datetime-local" class="form-control" id="txt_search_end_time">
                    </div>
                </div>

                <div class="row row-gap">
                    <label class="control-label col-sm-2 label-font" for="txt_search_title_name">发票抬头</label>
                    <div class="col-sm-4">
                        <input type="text" class="form-control" id="txt_search_title_name">
                    </div>
                </div>

                <div class="row row-gap">
                    <div class="col-sm-offset-4" style="text-align:left;">
                        <button type="button" style="margin-left:50px" id="btn_filter" class="btn btn-primary" onclick="filter();">过滤</button>
                        <button type="button" style="margin-left:50px" id="btn_reset_filter" class="btn btn-primary" onclick="init();">重置过滤</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <h2 style="font-size: 18px; color: red;">只生成相同出货单号和相同客户代号的出货单，并且是一个客户生成一个出货单，可以先按照出货单号和客户代号查询，然后生成出货单</h2>
    <!-- 工具栏-->
    <div id="toolbar" class="btn-group">
        <button id="btn_add" type="button" class="btn btn-default" onclick="ModalMClick();">
            <span class="glyphicon glyphicon-make" aria-hidden="true"></span>生成出库单
        </button>
        <button id="btn_export" type="button" class="btn btn-default" onclick="exportExcel();">
            <span class="glyphicon glyphicon-export" aria-hidden="true"></span>批量导出
        </button>
    </div>
    <table id="table"></table>
</div>

<!-- JavaScript files-->
<!-- jquery.js -->
<script src="../../static/js/lib/jquery.min.js" th:src="@{/js/lib/jquery.min.js}"></script>
<!-- Bootstrap.js -->
<script src="../../static/js/lib/bootstrap3.4.1.min.js" th:src="@{/js/lib/bootstrap3.4.1.min.js}"></script>
<!-- Bootstrap-table.js -->
<script src="../../static/js/lib/bootstrap-table.min.js" th:src="@{/js/lib/bootstrap-table.min.js}"></script>
<script src="../../static/js/lib/bootstrap-table-zh-CN.min.js" th:src="@{/js/lib/bootstrap-table-zh-CN.min.js}"></script>
<!-- sweetalert2.js -->
<script src="../../static/js/lib/sweetalert.min.js" th:src="@{/js/lib/sweetalert.min.js}"></script>
<script src="../../static/js/lib/es6-promise.auto.min.js" th:src="@{/js/lib/es6-promise.auto.min.js}"></script>
<!-- jquery-ui.js -->
<script src="../../static/js/lib/jquery-ui.min.js" th:src="@{/js/lib/jquery-ui.min.js}"></script>
<!-- select2.js -->
<script src="../../static/js/lib/select2.min.js" th:src="@{/js/lib/select2.min.js}"></script>
<script src="../../static/js/lib/Select2-zh-CN.js" th:src="@{/js/lib/Select2-zh-CN.js}"></script>
<script src="../../static/js/common.js" th:src="@{/js/common.js}"></script>
<script src="../../static/js/dragModel.js" th:src="@{/js/dragModel.js}"></script>
<script>
    /** 初始化 */
    let $table = $('#table');

    // 服务器分页获取数据
    function getServerPaging(node, url, queryParams) {
        initTable(node, url, [10, 20, 30, 40, 50, 60, "All"], queryParams, [{
                checkbox: true
            }, {
                field: 'orderNumber',
                title: '订单号',
                width: '170px',
                formatter: stringFormatter
            }, {
                field: 'billOfSaleNumber',
                title: '出货单号',
                width: '170px',
                formatter: stringFormatter
            }, {
                field: 'code',
                title: '客户代码',
                width: '90px',
                formatter: stringFormatter
            }, {
                field: 'productNumber',
                title: '客户料号',
                width: '170px',
                formatter: stringFormatter
            }, {
                field: 'itemName',
                title: '品名',
                width: '90px',
                formatter: stringFormatter
            }, {
                field: 'spec',
                title: '规格',
                width: '170px',
                formatter: stringFormatter
            }, {
                field: 'exportAmount',
                title: '出库数量',
                width: '160px',
                formatter: stringFormatter
            }, {
                field: 'unitPrice',
                title: '单价',
                width: '90px',
                formatter: stringFormatter
            }, {
                field: 'money',
                title: '金额',
                width: '90px',
                formatter: stringFormatter
            }, {
                field: 'billOfSaleDate',
                title: '出库日期',
                width: '170px',
                formatter: dateFormatter
            }, {
                field: 'titleName',
                title: '发票抬头',
                width: '200px',
                formatter: stringFormatter
            }, {
                field: 'remark',
                title: '备注',
                width: '90px',
                formatter: stringFormatter
            }]);
    }

    // 初始化表格数据
    function init() {
        getServerPaging($table, "/invoice-history/getBillOfSaleHistory", params => {
            return { limit: params.limit, offset: params.offset, sort: "create_time", order: "DESC" };
        });
    }

</script>
<script>
    /** 功能 */
    // 过滤
    function filter(){
        let time = [$("#txt_search_start_time"), $("#txt_search_end_time")];

        if ("" !== time[0][0].validationMessage || "" !== time[1][0].validationMessage) {
            swal("操作提示", "请填写完整的时间", "info");
            return;
        }

        let data = { orderNumber: $("#txt_search_order_number").val(), code: $("#txt_search_code").val(), titleName: $("#txt_search_title_name").val(), productNumber: $("#txt_search_product_number").val(),
            itemName: $("#txt_search_item_name").val(), spec: $("#txt_search_spec").val(), billOfSaleNumber: $("#txt_search_bill_of_sale_number").val(), startTime: time[0].val(), endTime: time[1].val() };

        if ("" === data["orderNumber"] && "" === data["code"] && "" === data["productNumber"] && "" === data["itemName"] && "" === data["spec"]
            && "" === data["billOfSaleNumber"] && "" === data["titleName"] && "" === data["startTime"] && "" === data["endTime"]) {
            swal("操作提示", "请填写过滤参数", "info");
            return;
        }

        getServerPaging($table, "/invoice-history/getBillOfSaleHistoryByConditions", params => {
            let result = { limit: params.limit, offset: params.offset, sort: "create_time", order: "DESC", orderNumber: data["orderNumber"], code: data["code"], productNumber: data["productNumber"],
                itemName: data["itemName"], billOfSaleNumber: data["billOfSaleNumber"], spec: data["spec"], startTime: data["startTime"], endTime: data["endTime"], titleName: data["titleName"]};

            removeEmptyField(result);

            return result;
        });
    }

    // 导出excel
    function exportExcel() {
        let selections = $table.bootstrapTable('getSelections');
        if (selections.length === 0) {
            swal("操作提示", "请选择记录", "info");
        } else {
            parameterPostRequest("/invoice-history/exportExcel", selections, () => loadFile("出货单历史信息.xlsx"));
        }
    }

    // 生成出货单功能
    function ModalMClick() {
        let selections = $table.bootstrapTable('getSelections');
        if (selections.length === 0 ) {
            swal("操作提示", "请选择记录", "info");
        } else if (selections.length > 1) {
            swal("操作提示", "只能选择一条记录进行导出", "info");
        } else {
            parameterPostRequest("/invoice-history/exportExcelByModel", selections, () => {
                swal("正确", "导出成功", "success");
                init();
                loadFile("送货单（发，亿，永）.xlsx");
            });
        }
    }
</script>

</body>

</html>